<!--
 * @Author: zxh
 * @Email: 1271027008@qq.com
 * @Date: 2020-02-24 08:53:28
 * @Descripttion: 有效期管理
 -->
<div class="effective_manage_container">
    <div nz-row nzGutter="10">
        <div nz-col nzSpan="6">
            <label class="line-height-32-prefix">入库时间：</label>
            <nz-range-picker nzDropdownClassName="date-range" [(ngModel)]="dateRange" class="width-1000"
                (ngModelChange)="onDateChange($event)"></nz-range-picker>
        </div>
        <div nz-col nzSpan="3">
            <label class="line-height-32-prefix">库房：</label>
            <nz-select nzDropdownClassName="select_custom" [(ngModel)]="selWhse" style="width: 68%;"
                (ngModelChange)="selectKF($event)">
                <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                <nz-option *ngFor="let option of whseDataList" [nzValue]="option.id" [nzLabel]="option.name">
                </nz-option>
            </nz-select>
        </div>
        <div nz-col nzSpan="3">
            <label class="line-height-32-prefix">库区：</label>
            <nz-select nzDropdownClassName="select_custom" [(ngModel)]="selWhseArea" style="width: 68%;"
                (ngModelChange)="selectKQ($event)">
                <nz-option nzValue="" nzLabel="-请选择-"></nz-option>
                <nz-option *ngFor="let option of whseAreaDataList" [nzValue]="option.id" [nzLabel]="option.name">
                </nz-option>
            </nz-select>
        </div>
        <div nz-col nzSpan="3">
            <label class="line-height-32-prefix">状态：</label>
            <nz-select nzDropdownClassName="select_custom" [(ngModel)]="selStatus" style="width: 68%;"
                (ngModelChange)="selectStatus($event)">
                <nz-option *ngFor="let option of statusDataList" [nzValue]="option.id" [nzLabel]="option.label">
                </nz-option>
            </nz-select>
        </div>
        <div nz-col nzSpan="4">
            <label class="line-height-32-prefix">产品编码：</label>
            <input class="width-900" appHotSearch (hotSearchEmit)="getList('search')" type="text" nz-input placeholder="输入产品编码"
                [(ngModel)]="proCode" />
        </div>
        <div nz-col nzSpan="4">
            <label class="line-height-32-prefix">产品名称：</label>
            <input class="width-900" appHotSearch (hotSearchEmit)="getList('search')" type="text" nz-input placeholder="输入产品名称"
                [(ngModel)]="proName" />
        </div>
    </div>
    <div nz-row nzGutter="10" class="margin-top-16">
        <div nz-col nzSpan="6">
            <button (click)="subVerify()" nz-button nzType="primary" [disabled]="numberOfChecked !==1 || selStatus == 1"
                style="margin-right: 10px;"
                [class]="numberOfChecked !== 1 || selStatus == 1?'ant-btn ant-btn-primary defaultBg disabledBg':'ant-btn ant-btn-primary defaultBg'">提交请验</button>
            <button (click)="showModal()" nz-button nzType="primary" [disabled]="numberOfChecked !== 1 || selStatus == 1"
                [class]="numberOfChecked !== 1 || selStatus == 1?'ant-btn ant-btn-primary defaultBg disabledBg':'ant-btn ant-btn-primary defaultBg'">批次预留</button>
        </div>
    </div>  
    <div nz-row class="margin-top-16">
        <nz-table #basicTable [nzData]="listOfData" [nzFrontPagination]="false"
            (nzCurrentPageDataChange)="dataChange($event)"  nzSize="small">
            <thead>
                <tr>
                    <th nzShowCheckbox [(nzChecked)]="isAllCheckedStatus" [nzIndeterminate]="isHalfCheckedStatus"
                        (nzCheckedChange)="checkAll($event)"></th>
                    <th>产品编码</th>
                    <th>产品名称</th>
                    <th>库房</th>
                    <th>库区</th>
                    <th>条码批次</th>
                    <th>重量</th>
                    <th>生产日期</th>
                    <th>有效期</th>
                    <th>剩余有效期</th>
                    <th>请验状态</th>
                    <th>检验日期</th>
                    <th>备用</th>
                </tr>
            </thead>
            <tbody>
                <tr *ngFor="let data of basicTable.data" class="editable-row">
                    <td nzShowCheckbox [(nzChecked)]="mapOfCheckedId[data.id]"
                        (nzCheckedChange)="refreshStatus($event)"></td>
                    <td>{{ data.materialCode }}</td>
                    <td>{{ data.materialName }}</td>
                    <td>{{ data.warehouseName }}</td>
                    <td>{{ data.warehouseAreaName }}</td>
                    <td>{{ data.barcodeBatch }}</td>
                    <td>{{ data.weight }}</td>
                    <td>{{ data.productDate }}</td>
                    <td>{{ data.expDate }}</td>
                    <td>{{ data.surplusDate }}</td>
                    <td>{{ data.checkStatus==1?'待检':data.checkStatus==2?'合格':data.checkStatus==3?'不合格':data.checkStatus==4?'让步放行':data.checkStatus==0?'待审批':'' }}</td>
                    <td>{{ data.checkDate }}</td>
                    <td>{{ data.mark }}</td>
                </tr>
            </tbody>
        </nz-table>
    </div>
    <div nz-row class="margin-top-16" style="text-align: right;">
        <nz-pagination (nzPageIndexChange)="clickPage($event)" [nzPageIndex]="pageIndex" [nzTotal]="totalSize"
            [nzPageSize]="pageSize" [nzShowTotal]="totalTemplate">
        </nz-pagination>
        <ng-template #totalTemplate let-total> 总共 {{ totalSize }} 条 </ng-template>
    </div>
</div>
<div id="modal_box"></div>
<nz-modal nzMaskClosable="false" appDragModal [(nzVisible)]="isVisible" nzTitle="批次预留" (nzOnCancel)="handleCancel()"
    [nzFooter]="null">
    <form nz-form [formGroup]="validateForm" (ngSubmit)="subBatch()">
        <nz-form-item>
            <nz-form-label [nzSm]="6" [nzXs]="24">预留数量</nz-form-label>
            <nz-form-control [nzSm]="14" [nzXs]="24">
                <input nz-input formControlName="reserveNum" readonly/>
            </nz-form-control>
        </nz-form-item>
        <nz-form-item class="onShowItem">
            <nz-form-label [nzSm]="6" [nzXs]="24">预留数量</nz-form-label>
            <nz-form-control [nzSm]="14" [nzXs]="24">
                <input nz-input formControlName="barcodeBatch" readonly/>
            </nz-form-control>
        </nz-form-item>
        <nz-form-item>
            <nz-form-label [nzSm]="6" [nzXs]="24" nzRequired>预留原因</nz-form-label>
            <nz-form-control [nzSm]="14" [nzXs]="24" nzErrorTip="请输入预留原因">
                <textarea rows="4" nz-input formControlName="reserveReason"></textarea>
            </nz-form-control>
        </nz-form-item>
        <div nz-row class="modal_footer">
            <div nz-col nzSpan="24" style="text-align: right;">
                <button nz-button type="button" nzType="default" (click)="handleCancel()">取消</button>
                <button nz-button nzType="primary">确定</button>
            </div>
        </div>
    </form>
</nz-modal>